import React, { useState } from "react";
import { Tabs, Button, Descriptions, Input, message, Tooltip, Empty, Select, DatePicker } from "antd";
import "./patient_synthesis.less";
import {
	putPatient_fams,
	putPatient_jobs,
	putPatient_insur,
	delPatient_fams,
	delPatient_jobs,
	delPatient_insur,
	putPatient_cond,
	delPatient_cond,
	putEmgcontacts,
	delEmgcontacts
} from "@/api/components/patientInformation";
import { put_patients } from "@/api/components/patientInformation";
import moment from "moment";
import { useTranslation } from "react-i18next";
export default function patient_synthesis_tabs(prop: any) {
	const { t } = useTranslation();
	let utilA = "viewComponents.patientInformation";
	let { tabKey, userList, setTabKey, setUserList, success } = prop;
	const [editing, setEditing] = useState({});
	const tabChange = (key: string) => {
		setTabKey((tabKey = key));
	};
	// 时间戳转成时分秒
	function timestampToDate(timestamp: any) {
		const date = new Date(timestamp); // 如果timestamp是数字，直接使用；如果是字符串，确保是数字字符串
		const year = date.getFullYear();
		const month = (date.getMonth() + 1).toString().padStart(2, "0"); // 月份是从0开始的
		const day = date.getDate().toString().padStart(2, "0");
		return `${year}-${month}-${day}`;
	}
	// 开始修改-弹出input框
	const startEditing = (key: string, value: string, i: any) => {
		setEditing({ [key + i]: value });
		console.log(key, value, i);
	};
	// 关闭修改-关闭input框
	const stopEditing = async (key: string, value: string, key1: string, i: any = "", spanVal: string) => {
		setEditing({});
		// 如果值没有变化
		if (spanVal == value) {
			return;
		} else {
			let bool;
			let newValue;
			let start_end;
			let end_start;
			switch (tabKey) {
				case "0":
					setUserList(
						(userList = {
							...userList,
							[key1]: userList[key1].map((item: any, index: any) => {
								if (index == i) {
									item[key] = value;
								}
								return item;
							})
						})
					);
					bool = await put_patients(userList.patientInfo[i]);
					break;
				case "1":
					setUserList(
						(userList = {
							...userList,
							[key1]: userList[key1].map((item: any, index: any) => {
								if (index == i) {
									item[key] = value;
								}
								return item;
							})
						})
					);
					bool = await putPatient_fams(userList.patientFams[i]);
					break;
				case "2":
					start_end = Date.parse(value);
					end_start = userList[key1][i][key == "validFrom" ? "validTo" : "validFrom"];
					if (key == "validFrom") {
						if (start_end > end_start) {
							message.error(t(`${utilA}.validFrom_validTo_work`));
							return;
						}
					} else if (key == "validTo") {
						if (start_end < end_start) {
							message.error(t(`${utilA}.validFrom_validTo_work`));
							return;
						}
					}
					setUserList(
						(userList = {
							...userList,
							[key1]: userList[key1].map((item: any, index: any) => {
								if (index == i) {
									item[key] = key == "validFrom" || key == "validTo" ? Date.parse(value) : value; // 时分秒转成时间戳
								}
								return item;
							})
						})
					);
					newValue = {
						...userList.patientJobs[i]
					};
					bool = await putPatient_jobs(newValue);
					break;
				case "3":
					start_end = Date.parse(value);
					end_start = Date.parse(userList[key1][key == "validFrom" ? "validTo" : "validFrom"]);
					if (key == "validFrom") {
						if (start_end > end_start) {
							message.error(t(`${utilA}.validFrom_validTo_insur`));
							return;
						}
					} else if (key == "validTo") {
						if (start_end < end_start) {
							message.error(t(`${utilA}.validFrom_validTo_insur`));
							return;
						}
					}
					setUserList(
						(userList = {
							...userList,
							[key1]: userList[key1].map((item: any, index: any) => {
								if (index == i) {
									item[key] = value;
								}
								return item;
							})
						})
					);
					bool = await putPatient_insur(userList.patientInsurs[i]);
					break;
				case "4":
					setUserList(
						(userList = {
							...userList,
							[key1]: userList[key1].map((item: any, index: any) => {
								if (index == i) {
									item[key] = value;
								}
								return item;
							})
						})
					);
					bool = await putPatient_cond(userList.patientConds[i]);
					break;
				case "5":
					setUserList(
						(userList = {
							...userList,
							[key1]: userList[key1].map((item: any, index: any) => {
								if (index == i) {
									item[key] = value;
								}
								return item;
							})
						})
					);
					bool = await putEmgcontacts(userList.patEmgcontacts[i]);
					break;
				default:
					break;
			}
			if (bool) {
				message.success(t(`${utilA}.modifiedSuccessfully`));
			}
		}
	};
	// 获取tabs的值
	let getInp_span = (text: string, key1: any = 0, i: any = 0) => {
		let spanVal = String(userList[key1][i][text]) || "未填写";
		let textVal = text + i;
		return editing[textVal] || editing[textVal] == "" ? (
			getConponents(text, key1, textVal, i, spanVal)
		) : (
			<Tooltip color="blue" placement="topLeft" title={t(`${utilA}.edit`)} arrowPointAtCenter>
				<div style={{ cursor: "pointer" }} onClick={() => startEditing(text, spanVal, i)}>
					{getContent(text, key1, spanVal)}
				</div>
			</Tooltip>
		);
	};
	// 获取tabs的值的函数
	let getContent = (text: string, key1: string, spanVal: string | number) => {
		if ((text == "validFrom" || text == "validTo") && key1 == "patientJobs") {
			return timestampToDate(Number(spanVal));
		} else if (text == "patLevel") {
			switch (spanVal) {
				case "1":
					return t(`${utilA}.soldier`);
					break;
				case "2":
					return t(`${utilA}.civilServant`);
					break;
				case "3":
					return t(`${utilA}.teacher`);
					break;
				default:
					break;
			}
		} else if (text == "insType") {
			switch (spanVal) {
				case 1:
					return t(`${utilA}.commercialInsur`);
					break;
				case "1":
					return t(`${utilA}.commercialInsur`);
					break;
				case 2:
					return t(`${utilA}.residentInsur`);
					break;
				case "2":
					return t(`${utilA}.residentInsur`);
					break;
				case 3:
					return t(`${utilA}.employeeInsur`);
					break;
				case "3":
					return t(`${utilA}.employeeInsur`);
					break;
				default:
					break;
			}
		} else if (text == "duration5yr") {
			if (spanVal == 1) {
				return t(`${utilA}.no`);
			} else {
				return t(`${utilA}.yes`);
			}
		} else {
			return spanVal;
		}
	};
	// 获取tabs的值的函数
	let getConponents = (text: string, key1: string, textVal: string, i: number, spanVal: string) => {
		if (
			text == "patLevel" ||
			text == "insType" ||
			text == "duration5yr" ||
			text == "famRelatives" ||
			text == "relationship" ||
			text == "gender"
		) {
			let option: any;
			switch (text) {
				case "patLevel":
					option = [
						{
							value: "1",
							label: t(`${utilA}.soldier`)
						},
						{
							value: "2",
							label: t(`${utilA}.civilServant`)
						},
						{
							value: "3",
							label: t(`${utilA}.teacher`)
						}
					];
					break;
				case "insType":
					option = [
						{
							value: "1",
							label: t(`${utilA}.commercialInsur`)
						},
						{
							value: "2",
							label: t(`${utilA}.residentInsur`)
						},
						{
							value: "3",
							label: t(`${utilA}.employeeInsur`)
						}
					];
					break;
				case "gender":
					option = [
						{
							value: t(`${utilA}.man`),
							label: t(`${utilA}.man`)
						},
						{
							value: t(`${utilA}.woman`),
							label: t(`${utilA}.woman`)
						},
						{
							value: t(`${utilA}.other`),
							label: t(`${utilA}.other`)
						}
					];
					break;
				case "duration5yr":
					option = [
						{
							value: "0",
							label: t(`${utilA}.yes`)
						},
						{
							value: "1",
							label: t(`${utilA}.no`)
						}
					];
					break;
				default:
					option = [
						{
							value: t(`${utilA}.fatherAndSon`),
							label: t(`${utilA}.fatherAndSon`)
						},
						{
							value: t(`${utilA}.matherAndSon`),
							label: t(`${utilA}.matherAndSon`)
						},
						{
							value: t(`${utilA}.brotherAndSister`),
							label: t(`${utilA}.brotherAndSister`)
						},
						{
							value: t(`${utilA}.brother`),
							label: t(`${utilA}.brother`)
						},
						{
							value: t(`${utilA}.friend`),
							label: t(`${utilA}.friend`)
						},
						{
							value: t(`${utilA}.other`),
							label: t(`${utilA}.other`)
						}
					];
					break;
			}
			return (
				<Select
					defaultValue={editing[textVal] == "未填写" ? "" : editing[textVal]}
					onChange={value => stopEditing(text, value, key1, i)}
					options={option}
				/>
			);
		} else if (text == "validFrom" || text == "validTo" || text == "dateWaiver" || text == "birthday") {
			return (
				<DatePicker
					defaultValue={tabKey == "2" ? moment(timestampToDate(editing[textVal] * 1)) : moment(editing[textVal])}
					onChange={(date, dateString) => stopEditing(text, dateString, key1, i)}
				/>
			);
		} else {
			return (
				<Input
					autoFocus
					value={editing[textVal] == "未填写" ? "" : editing[textVal]}
					onChange={e => setEditing({ [textVal]: e.target.value })}
					onBlur={e => stopEditing(text, e.target.value, key1, i, spanVal)}
				/>
			);
		}
	};
	// 删除tabs
	let delPatient_synthesis = async (i: any = "") => {
		let bool;
		switch (tabKey) {
			case "1":
				bool = await delPatient_fams(userList.patientFams[i].famId);
				break;
			case "2":
				bool = await delPatient_jobs(userList.patientJobs[i].jobId);
				break;
			case "3":
				bool = await delPatient_insur(userList.patientInsurs[i].insId);
				break;
			case "4":
				bool = await delPatient_cond(userList.patientConds[i].condId);
				break;
			case "5":
				bool = await delEmgcontacts(userList.patEmgcontacts[i].emgId);
				break;
			default:
				break;
		}
		if (bool) {
			message.success(t(`${utilA}.deleteSuccessfully`));
		}
		success && success();
	};
	// 抽屉数据
	let getUserList = (title: string) => {
		switch (title) {
			case t(`${utilA}.patientInfo`):
				return userList.patientInfo?.length == 0 ? (
					<Empty />
				) : (
					userList.patientInfo?.map((item: any, index: any) => {
						return (
							<Descriptions column={6} key={item.famId} bordered style={{ margin: "0 0 20px 0" }}>
								<Descriptions.Item label={t("patientBasic.patient_code")} span={6}>
									{getInp_span("patCardno", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.full_name")} span={3}>
									{getInp_span("fullName", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.age")} span={3}>
									{getInp_span("age", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.gender")} span={3}>
									{getInp_span("gender", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.ethnicity")} span={3}>
									{getInp_span("ethnicity", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.nationality")} span={3}>
									{getInp_span("occupation", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.pat_address")} span={3}>
									{getInp_span("addrCity", "patientInfo", index)}
								</Descriptions.Item>

								<Descriptions.Item label={t("patientBasic.birthday")} span={3}>
									{getInp_span("birthday", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.phone_numb")} span={3}>
									{getInp_span("phoneNumb", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.grp_email")} span={3}>
									{getInp_span("emailAddr", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.house_number")} span={3}>
									{getInp_span("addrHouseno", "patientInfo", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t("patientBasic.province_city")} span={3}>
									{getInp_span("addrProvince", "patientInfo", index)}
								</Descriptions.Item>
							</Descriptions>
						);
					})
				);
				break;
			case t(`${utilA}.familyInfo`):
				return userList.patientFams?.length == 0 ? (
					<Empty />
				) : (
					userList.patientFams?.map((item: any, index: any) => {
						return (
							<Descriptions
								column={6}
								extra={
									<Button onClick={() => delPatient_synthesis(index)} type="primary" danger>
										X
									</Button>
								}
								key={item.famId}
								bordered
								style={{ margin: "0 0 20px 0" }}
							>
								<Descriptions.Item label={t(`${utilA}.famFullName`)} span={3}>
									{getInp_span("famFullName", "patientFams", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.relationship`)} span={3}>
									{getInp_span("famRelatives", "patientFams", index)}
								</Descriptions.Item>

								<Descriptions.Item label={t(`${utilA}.famAddress`)} span={3}>
									{getInp_span("famAddress", "patientFams", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.addrProvince`)} span={3}>
									{getInp_span("addrProvince", "patientFams", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.addrCity`)} span={3}>
									{getInp_span("addrCity", "patientFams", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.addrDistrict`)} span={3}>
									{getInp_span("addrDistrict", "patientFams", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.addrCommunity`)} span={3}>
									{getInp_span("addrCommunity", "patientFams", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.addrWard`)} span={3}>
									{getInp_span("addrWard", "patientFams", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.famPhoneNumb`)} span={6}>
									{getInp_span("famPhoneNumb", "patientFams", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.famCitizenId`)} span={6}>
									{getInp_span("famCitizenId", "patientFams", index)}
								</Descriptions.Item>
							</Descriptions>
						);
					})
				);
				break;
			case t(`${utilA}.careerInfo`):
				return userList.patientJobs?.length == 0 ? (
					<Empty />
				) : (
					userList.patientJobs?.map((item: any, index: any) => {
						return (
							<Descriptions
								extra={
									<Button onClick={() => delPatient_synthesis(index)} type="primary" danger>
										X
									</Button>
								}
								column={4}
								key={item.jobId}
								bordered
								style={{ margin: "0 0 20px 0" }}
							>
								<Descriptions.Item label={t(`${utilA}.famFullName`)} span={2}>
									{userList.fullName}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.occupation`)} span={2}>
									{getInp_span("occupation", "patientJobs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.salary`)} span={2}>
									{getInp_span("salary", "patientJobs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.officePhone`)} span={2}>
									{getInp_span("officePhone", "patientJobs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.validFrom`)} span={2}>
									{getInp_span("validFrom", "patientJobs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.validTo`)} span={2}>
									{getInp_span("validTo", "patientJobs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.patLevel`)} span={2}>
									{getInp_span("patLevel", "patientJobs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.addrWork`)} span={2}>
									{getInp_span("addrWork", "patientJobs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.workplace`)} span={2}>
									{getInp_span("workplace", "patientJobs", index)}
								</Descriptions.Item>
							</Descriptions>
						);
					})
				);
				break;
			case t(`${utilA}.InsurInfo`):
				return userList.patientInsurs?.length == 0 ? (
					<Empty />
				) : (
					userList.patientInsurs?.map((item: any, index: any) => {
						return (
							<Descriptions
								extra={
									<Button onClick={() => delPatient_synthesis(index)} type="primary" danger>
										X
									</Button>
								}
								column={4}
								key={item.insId}
								bordered
								style={{ margin: "0 0 20px 0" }}
							>
								<Descriptions.Item label={t(`${utilA}.famFullName`)} span={2}>
									{userList.fullName}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.validFrom`)} span={2}>
									{getInp_span("validFrom", "patientInsurs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.validTo`)} span={2}>
									{getInp_span("validTo", "patientInsurs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.dateWaiver`)} span={2}>
									{getInp_span("dateWaiver", "patientInsurs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.insType`)} span={2}>
									{getInp_span("insType", "patientInsurs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.duration5yr`)} span={2}>
									{getInp_span("duration5yr", "patientInsurs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.waiverCostSharing`)} span={2}>
									{getInp_span("waiverCostSharing", "patientInsurs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.hiCode`)} span={4}>
									{getInp_span("hiCode", "patientInsurs", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.insCompany`)} span={4}>
									{getInp_span("insCompany", "patientInsurs", index)}
								</Descriptions.Item>
							</Descriptions>
						);
					})
				);
				break;
			case t(`${utilA}.healthStatus`):
				return userList.patientConds?.length == 0 ? (
					<Empty />
				) : (
					userList.patientConds?.map((item: any, index: any) => {
						return (
							<Descriptions
								extra={
									<Button onClick={() => delPatient_synthesis(index)} type="primary" danger>
										X
									</Button>
								}
								column={4}
								key={item.condId}
								bordered
								style={{ margin: "0 0 20px 0" }}
							>
								<Descriptions.Item label={t(`${utilA}.famFullName`)} span={2}>
									{userList.fullName}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.healthIndicators`)} span={2}>
									{getInp_span("healthIndicators", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.temperature`)} span={2}>
									{getInp_span("temperature", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.respiratory`)} span={2}>
									{getInp_span("respiratory", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.bmiIdx`)} span={2}>
									{getInp_span("bmiIdx", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.height_unit`)} span={2}>
									{getInp_span("height", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.weight_unit`)} span={2}>
									{getInp_span("weight", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.chestCfr`)} span={2}>
									{getInp_span("chestCfr", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.waistCfr`)} span={2}>
									{getInp_span("waistCfr", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.hipCfr`)} span={2}>
									{getInp_span("hipCfr", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.chrAlcohol`)} span={2}>
									{getInp_span("chrAlcohol", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.chrTobacco`)} span={2}>
									{getInp_span("chrTobacco", "patientConds", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.medAllergy`)} span={2}>
									{getInp_span("medAllergy", "patientConds", index)}
								</Descriptions.Item>
							</Descriptions>
						);
					})
				);
				break;
			case t(`${utilA}.emergencyContact`):
				return userList.patEmgcontacts?.length == 0 ? (
					<Empty />
				) : (
					userList.patEmgcontacts?.map((item: any, index: any) => {
						return (
							<Descriptions
								extra={
									<Button onClick={() => delPatient_synthesis(index)} type="primary" danger>
										X
									</Button>
								}
								column={4}
								key={item.emgId}
								bordered
								style={{ margin: "0 0 20px 0" }}
							>
								<Descriptions.Item label={t(`${utilA}.relationship`)} span={2}>
									{getInp_span("relationship", "patEmgcontacts", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.emgName`)} span={2}>
									{getInp_span("emgName", "patEmgcontacts", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.emgContact`)} span={4}>
									{getInp_span("emgContact", "patEmgcontacts", index)}
								</Descriptions.Item>
								<Descriptions.Item label={t(`${utilA}.remark`)} span={4}>
									{getInp_span("remark", "patEmgcontacts", index)}
								</Descriptions.Item>
							</Descriptions>
						);
					})
				);
				break;
			default:
				break;
		}
	};
	return (
		<Tabs
			onChange={tabChange}
			// tabBarExtraContent={tabKey == "3" && Object.keys(userList.patientInsurs).length !== 0 ? "" : ""}
			defaultActiveKey="0"
			items={[
				{
					label: t(`${utilA}.patientInfo`),
					key: "0",
					children: getUserList(t(`${utilA}.patientInfo`))
				},
				{
					label: t(`${utilA}.familyInfo`),
					key: "1",
					children: getUserList(t(`${utilA}.familyInfo`)),
					disabled: userList.patientInfo?.length == 0
				},
				{
					label: t(`${utilA}.careerInfo`),
					key: "2",
					children: getUserList(t(`${utilA}.careerInfo`)),
					disabled: userList.patientInfo?.length == 0
				},
				{
					label: t(`${utilA}.InsurInfo`),
					key: "3",
					children: getUserList(t(`${utilA}.InsurInfo`)),
					disabled: userList.patientInfo?.length == 0
				},
				{
					label: t(`${utilA}.healthStatus`),
					key: "4",
					children: getUserList(t(`${utilA}.healthStatus`)),
					disabled: userList.patientInfo?.length == 0
				},
				{
					label: t(`${utilA}.emergencyContact`),
					key: "5",
					children: getUserList(t(`${utilA}.emergencyContact`)),
					disabled: userList.patientInfo?.length == 0
				}
			]}
		/>
	);
}
